import { createSlice } from '@reduxjs/toolkit'
import { getBannerList, getProList } from '../../api/home'
// 创建切片
export const homeSlice = createSlice({
  name: 'home', // 定义模块的名字
  initialState: { // vuex state 放全局状态的地方
    // 全局状态
    bannerList: [],
    proList: []
  },
  reducers: { // vuex 中的 mutations
    // 修改数据的方法
    changeBannerList (state, action) {

      state.bannerList = action.payload
    },
    changeProList (state, action) {
      // console.log('22222222222', state);

      state.proList = action.payload
    }
  }
})
// 导出修改方法 changeBannerList, changeProList
// 获取到数据之后，只需要 dispatch 触发此处导出的两个函数
export const { changeBannerList, changeProList } = homeSlice.actions

// 如果需要异步操作状态管理，写如下代码
export function getBannerListAction (dispatch) {
  getBannerList().then(res => {
    dispatch(changeBannerList(res.data.data))
  })
}
// export function getProListAction (dispatch) {
//   getProList().then(res => {
//     // console.log('2222222222222', res);
//     dispatch(changeProList(res.data.data))
//   })
// }

export function getProListAction (params) {
  return (dispatch) => {
    getProList(params).then(res => {
      // console.log('2222222222222', res);
      dispatch(changeProList(res.data.data))
    })
  }
}


// 导出 reducer
export default homeSlice.reducer
